<template>
  <div class="second">
    <ci
      v-if="parent.parent"
      :parent="parent.parent"
      @parentes="replyComment"
    ></ci>
    <div class="top">
      <span>
        {{ parent.user && parent.user.nickname }}
      </span>
      <span>
        {{ parent.create_date | relative }}
      </span>
      <span class="right" @click="replyComment(parent)">回复</span>
    </div>

    <div class="text2">{{ parent.content }}</div>
  </div>
</template>

<script>
import { relative } from "@/utils/time_filter.js";
export default {
  name: "ci",
  props: ["parent"],
  data() {
    return {};
  },
  filters: {
    relative,
  },
  methods: {
    replyComment(parent) {
      this.$emit("parentes", parent);
    },
  },
};
</script>

<style lang="less" scoped>
.second {
  width: 100%;
  box-sizing: border-box;
  padding: 5px;
  border: 1px solid #ccc;
  font-size: 14px;
  .top {
    margin: 5px;
    display: flex;
    justify-content: space-between;
    .right {
      color: #999;
      font-size: 12px;
    }
  }
  .text2 {
    padding: 5px;
  }
}
</style>